var dList = [];
var plainDates = [];
var hList = [[]];
function hideTime(){
    $("#schedule").find(".mainDPDiv").css("display","none");
    $("#schedule").find(".hour1").css("display","none");
    $("#schedule").find(".hour2").css("display","none");
}
function computeDates(startDate,endDate){
    var startYr, startMo, startDay;
    var endYr, endMo, endDay;
    
    //  YYYY-MM-DD
    //  0123456789
    startMo = startDate.substring(5,7);
    endMo = endDate.substring(5,7);
    startDay = startDate.substring(8);
    endDay = endDate.substring(8);
    startYr = startDate.substring(0,4);
    endYr = endDate.substring(0,4);
    
    startMo = parseInt(startMo,10);
    startDay = parseInt(startDay,10);
    startYr = parseInt(startYr,10);
    
    endMo = parseInt(endMo,10);
    endDay = parseInt(endDay,10);
    endYr = parseInt(endYr,10);
                
    var d = startDay;
    var m = startMo;
    var y = startYr;
    var dates = [];
    var x = 0;
    var strD = "";
    
    var lastOfTheMonth = getLastOfMonth(startMo,startYr) +1;
    while(true){
        if((d > endDay && endMo == m && y == endYr) || (m > endMo && y == endYr) || (y > endYr)){
            break;
        }
        strD = (d < 10?"0" + d:d);
        plainDates[x] = y + "-" + (m < 10?"0" + m:m) + "-" + strD
        dates[x++] = formatDate(m,strD,y);
        d = d+1;
        d = d % lastOfTheMonth;
        if(d == 0){
            d += 1;
            m = m+1;
            m = m % 13;
            if(m == 0){
                m += 1;
                y += 1;
            }
            lastOfTheMonth = getLastOfMonth(m,y) +1;
        }
    }
    return dates;
}
function formatDate(month,day,year){
    var newMonth = "";
    var formattedDate = "";
    switch(month){
        case 1:
            newMonth = "January";
            break;
        case 2:
            newMonth = "February";
            break;
        case 3:
            newMonth = "March";
            break;
        case 4:
            newMonth = "April";
            break;
        case 5:
            newMonth = "May";
            break;
        case 6:
            newMonth = "June";
            break;
        case 7:
            newMonth = "July";
            break;
        case 8:
            newMonth = "August";
            break;
        case 9:
            newMonth = "September";
            break;
        case 10:
            newMonth = "October";
            break;
        case 11:
            newMonth = "November";
            break;
        case 12:
            newMonth = "December";
            break;
    }
    formattedDate = newMonth + " " + day + ", " + year;
    return formattedDate;
}
function getLastOfMonth(mon,year){
    switch(mon){
        case 2:
            if((year%4 == 0 && year%100 != 0) || (year%4 == 0 && year%100 == 0 && year%400==0)){
                return 29;
                break;
            }
            return 28;
            break;
        case 4:
        case 6:
        case 9:                    
        case 11:
            return 30;
            break;
        default:
            return 31;
            break;
    }
}
function doChange(){
    if(confirm("Are you sure you want to switch to this date: " + $("#dateSelect").val() + " without saving?")){
        //LOAD PROPER CODE
        $("#centerDayPlanner").load("./GetDayPlannerServlet?date=" + $("#dateSelect").val() + "&tripId=" + tripId);
    }
    else{
    //alert("no");
    }
}
function generateSchedule(){
    var html=[];
    var ls = [];
    ls = computeDates(startDate,endDate);
    $.get("./GetDayPlannerServlet?tripId=" + tripId + "&dates=" + plainDates,function(htmlList){
        dList = ls;
        var div="<div class='outerBox' ";                
        var divClose = "</div>";
        var span = "<span class='heading'>";
        var spanClose = "</span>";
        var innerDiv = "<div class='innerBox' ";
        var i = 0;
        var j = 0;
        hList = parseStringIntoList(htmlList,"|");
        while(i < ls.length){
            html[j++]= div + "id='date_" + i + "'>" + span +  ls[i] + spanClose 
            + innerDiv + "id='inner_" + i + "' alt='" + ls[i] +"' onclick='clickedFunction(" + i +")' > ";
            //    html[j++] = hList[i];
            html[j++] = divClose;
            i++;
        }
        for(var k = 0; k < html.length; k++){
            document.getElementById("schedule").innerHTML += html[k];
        }
    });
     
}          
function parseStringIntoList(htmlList,del){
    var ls = [[]];
    var i = 0;
    var d = 0;
    var x = htmlList;
    while(x.indexOf(del) != -1){
        ls[d][i++] = x.substring(0,x.indexOf(del));
        x = x.substring(x.indexOf(del)+1);
        if(i % 48 == 0){
            d++;
            i = 0;
            ls[d] = [];
            
        }
    }
    ls[d][i] = htmlList.substring(htmlList.lastIndexOf(del)+1);
    return ls;
}
function clickedFunction(num){
    
    $("#rightDayPlanner").find("input").removeAttr("class");
    $("#rightDayPlanner").find("input").removeAttr("readonly");
    $("#rightDayPlanner").find("input[type=text]").css("background-color","#FFFFFF");
    $("#rightDayPlanner").html("<span class='hour2'>" + $("#inner_" + num).attr("alt") + "<input type='button' value='Save' id='savePopup' onclick='saveDP(" + num + ")' class='contentButton'/><input type='button' class='contentButton' value='Close' id='closePopup' onclick='closeDP(" + num + ")' /></span>"+
        "<div id='DPDIV_" + num + "' >" + calculateHours(num) + "</div>");
    $("#rightDayPlanner").show("fast");
    if(firstClose[num] == null){
        firstClose[num] = true;
    }
    $(document).on("click",".groupingDP",function(){
        alert("STUFF");
        toggleDiv($(this).attr("alt"));
    });
}
function toggleDiv(id){
    $("#DP_" + id).slideToggle();
}
function saveDP(num){
    var l = [];
    l = document.getElementsByClassName("textareaDP");
    var bool = false;
    for(var k = 0; k < l.length; k++){
        if(hList[num][k] != l[k].value){
            hList[num][k] = l[k].value;
            bool = true;
        }
    }
    if(bool){
        var str = "";
        for(var k = 0; k < hList[num].length-1; k++){
            str += hList[num][k] + "|";
        }
        str += hList[num][hList[num].length-1];
        $.get("./SaveDayPlannerServlet?html=" + str + "&tripId=" + tripId + "&date=" + plainDates[num],function(varib){
            alert(varib);
        });
    }
}

function showContent1(num){
    $("#content_1_" + num).toggle();
}
function hideContent1(num){
    $("#content_1_" + num).hide();
    $("#button_1_" + num).val("Show");
    $("#button_1_" + num).attr("onclick","showContent1(" + num + ")");
}
function showContent2(num){
    $("#content_2_" + num).toggle();
    $("#button_2_" + num).val("Hide");
    $("#button_2_" + num).attr("onclick","hideContent2(" + num + ")");
}
function hideContent2(num){
    $("#content_2_" + num).hide();
    $("#button_2_" + num).val("Show");
    $("#button_2_" + num).attr("onclick","showContent2(" + num + ")");
}
function closeDP(num){
    $("#rightDayPlanner").hide("fast");
}
function search(){
    var txt = $("#searchBox").val().toLowerCase();
    var ls = dList;
    $("#schedule").find(".outerBox").each(function(){
        $(this).css("display","inline-block");
    });
    for(var j = 0; j < ls.length; j++){
        var bool = true;
        var i = 0;
        var k = 0;
        if(txt.length > 1){
            i = ls[j].toLowerCase().indexOf(txt[k]);
            for(k = 0; k < txt.length-1; k++){
                if(ls[j].charAt(++i) != txt[k+1]){
                    bool = false;
                    break;
                }
            }              
        }
        else if(txt.length == 1){
            if(ls[j].toLowerCase().indexOf(txt[0]) == -1){
                bool = false;
            }
        }
        else{
                        
            break;
        }
        if(bool == false){
            $("#date_" + j).css("display","none");
        }
    // break;
    }
}
function makeDouble(t){
    t = t + "";
    if(t < 10){
        return "0" + t;
    }
    return t;
}
function calculateHours(num){
    var html = "";
    html += "<div class='miniDPDiv'></div><div id='mainDPDiv'>";
    var span1 = "<span class='hour1'";
    var span2 = "<span class='hour2'";
    var cSpan = "</span>";
    var str = "";
    var x = 0;
    var m = 0;
    var h = 0;
    html += "<span id='morning' class='groupingDP'  onclick='toggleDiv(" + 0 + ")' >Morning: 5:00 - 11:30 </span><div id='DP_0' class='invisible' >";
    for(h = 5; h < 12; h++){
        m = 0;
        while(m < 60){
            str = h+ ":" + m;
            //0
            html += span1 + " id='" + h + ":" + m + "' onclick='showContent1(" + h + ")'  >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_1_" + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            //15
            x++;
            str = h+ ":" + m;
            html += span2 + " id='" + h + ":" + m + "' onclick='showContent2(" + h + ")' >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_2_"  + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            x++;
        }
    }    
    html += "</div>";
    html += "<span id='afternoon' class='groupingDP' onclick='toggleDiv(" + 1 + ")' >Afternoon: 12:00 - 17:30 </span><div id='DP_1' class='invisible' >";
    for(h = 12; h < 18; h++){
        str = h+ ":" + m;
        m = 0;
        while(m < 60){
            str = h+ ":" + m;
            //0
            html += span1 + " id='" + h + ":" + m + "' onclick='showContent1(" + h + ")'  >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_1_" + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            //15
            x++;
            str = h+ ":" + m;
            html += span2 + " id='" + h + ":" + m + "' onclick='showContent2(" + h + ")' >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_2_"  + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            x++;
        }
    }    
    html += "</div>";
    html += "<span id='evening' class='groupingDP' onclick='toggleDiv(" + 2 + ")' >Evening: 18:00 - 23:30</span><div id='DP_2' class='invisible'>";
    for(h = 18; h < 24; h++){
        m = 0;
        while(m < 60){
            str = h+ ":" + m;
            //0
            html += span1 + " id='" + h + ":" + m + "' onclick='showContent1(" + h + ")'  >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_1_" + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            //15
            x++;
            str = h+ ":" + m;
            html += span2 + " id='" + h + ":" + m + "' onclick='showContent2(" + h + ")' >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_2_"  + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
            m += 30;
            x++;
        }
    }    
    html += "</div>";
    if(dList[num+1] != null){
        html += "<span class='hour2'>" + dList[num+1] + "</span>"
        html += "<span id='night' class='groupingDP' onclick='toggleDiv(" + 3 + ")'  >Night: 24:00 - 4:30</span><div id='DP_3' class='invisible'>";
        for(h = 0; h < 5; h++){
            m = 0;
            while(m < 60){
                str = h+ ":" + m;
                //0
                html += span1 + " id='" + h + ":" + m + "' onclick='showContent1(" + h + ")'  >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_1_" + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
                m += 30;
                //15
                x++;
                str = h+ ":" + m;
                html += span2 + " id='" + h + ":" + m + "' onclick='showContent2(" + h + ")' >" + makeDouble(h) + ":" + makeDouble(m) + cSpan + "<span class='content' id='content_2_"  + h + "' ><textarea placeholder='Type a brief description of this times events' rows='5' maxlength='255' class='textareaDP' id='txtDP_" + (x) +"' >" +hList[num][x].trim() + "</textarea></span>";
                m += 30;
                x++;
            }
        }
        html += "</div>";
    }
    html += "</div>";
    return html;
}
function doAlert(id){
    alert(id);
}